<template>
	<view>
		<view class="card_item">
			<view class="card_top">
				<view style="padding: 12rpx 16rpx 16rpx 18rpx;display: flex;align-items: center;">
					<text style="color: #fff;padding-left: 12rpx;font-size: 35rpx;">所属门店：氧舱深圳龙岗店</text>
				</view>
				<view style="width: 25%;font-size:25rpx;display: flex;justify-content: space-around;color: #FDCE9A;">
					待审核
				</view>
			</view>
			<view style="display: flex;justify-content: space-between;padding: 24rpx 27rpx 27rpx 24rpx;font-size: 20rpx;align-items: center;">
				<view style="display: flex;justify-content: space-between;align-items: center;">
					<image mode="aspectFill" src="../../../static/index/1130 1.png" style="width: 174rpx;height: 174rpx;" />
					<view style="padding-left: 27rpx;font-size: 20rpx;">
						<view>O2BOX微压富氧舱-S型</view>
						<view style="color: #9B9B9B;padding-top: 12rpx;">姓名：李子君</view>
						<view style="color: #9B9B9B;padding-top: 12rpx;font-size: 18rpx;">预约日期：2023.08.12 09:30-12:00</view>
						<view style="color: #9B9B9B;padding-top: 12rpx;font-size: 18rpx;">预约人数：3人</view>
						<view style="color: #9B9B9B;padding-top: 12rpx;font-size: 18rpx;">下单时间：2023.08.06 17:53:54</view>
					</view>
				</view>
			</view>
			<view class="bottom_cz">
				<view class="bottom_btn">取消订单</view>
			</view>
		</view>
		
		<view class="card_item" style="height: 300rpx;">
			<view class="card_top">
				<view style="padding: 12rpx 16rpx 16rpx 18rpx;display: flex;align-items: center;">
					<text style="color: #fff;padding-left: 12rpx;font-size: 35rpx;">所属门店：氧舱深圳龙岗店</text>
				</view>
				<view style="width: 25%;font-size:25rpx;display: flex;justify-content: space-around;color: #FF8B8B;">
					已取消
				</view>
			</view>
			<view style="display: flex;justify-content: space-between;padding: 24rpx 27rpx 27rpx 24rpx;font-size: 20rpx;align-items: center;">
				<view style="display: flex;justify-content: space-between;align-items: center;">
					<image mode="aspectFill" src="../../../static/index/1130 1.png" style="width: 174rpx;height: 174rpx;" />
					<view style="padding-left: 27rpx;font-size: 20rpx;">
						<view>O2BOX微压富氧舱-S型</view>
						<view style="color: #9B9B9B;padding-top: 12rpx;">姓名：李子君</view>
						<view style="color: #9B9B9B;padding-top: 12rpx;font-size: 18rpx;">预约日期：2023.08.12 09:30-12:00</view>
						<view style="color: #9B9B9B;padding-top: 12rpx;font-size: 18rpx;">预约人数：3人</view>
						<view style="color: #9B9B9B;padding-top: 12rpx;font-size: 18rpx;">下单时间：2023.08.06 17:53:54</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list1: [{
					name: '待发货',
				}, {
					name: '待付款',
				}, {
					name: '已发货'
				}]
			};
		}
	}
</script>

<style lang="scss" scoped>
.card_item{
	position: relative;
	width: 701rpx;
	height: 417rpx;
	background: #FFFFFF;
	box-shadow: 4rpx 4rpx 6rpx 3rpx rgba(212,212,212,0.25);
	border-radius: 20rpx 20rpx 20rpx 20rpx;
	margin-top: 41rpx;
	margin: 22rpx;
	.card_top{
		width: 701rpx;
		height: 87rpx;
		line-height: 74rpx;
		background: #484747;
		border-radius: 20rpx 20rpx 0px 0px;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	.bottom_cz{
		display: flex;
		justify-content: center;
		text-align: center;
		padding-top: 10rpx;
		font-size: 30rpx;
		.bottom_btn{
			width: 651rpx;
			height: 71rpx;
			border-radius: 100rpx;
			border: 1px solid #EBBB73;
			line-height: 71rpx;
			color: #EBBB73;
		}
	}
	.bg_time{
		width: 57rpx;
		height: 21rpx;
		background: #F6B450;
		border-radius: 2rpx;
		font-size: 15rpx;
		line-height: 21rpx;
		text-align: center;
		margin-left: 18rpx;
		color: #FFFFFF;
	}
}
</style>